{% extends base/base.html %}

{% block body_left %}
    {% init ext_groups = None %}

    {% include note/component/view_css.html %}

    <div class="card">
        <div class="grid-title">
            <span>{{title}}</span>
            <div class="float-right">
                <a class="btn btn-default" href="/note/group/manage">管理笔记本</a>
                <a class="btn btn-default" href="/note/tools?category=note">工具</a>
                {% if show_back %}
                    {% include common/button/back_button.html %}
                {% end %}
            </div>
        </div>

        {% include note/component/script/create_script.html %}
    </div>

    <div class="card">
        <div class="x-tab-box" data-tab-default="active" data-tab-key="tab">
            <a class="x-tab" data-tab-value="active">
                活跃(<span class="task-count">{{active_count}}</span>)
            </a>
            <a class="x-tab" data-tab-value="archived" href="/note/group_list?tab=archived">
                归档(<span class="task-count">{{archived_count}}</span>)
            </a>
            <a class="x-tab" data-tab-value="smart" 
                href="/note/group_list?show_note_types=false&tab=smart">
                智能(<span class="task-count">{{smart_count}}</span>)
            </a>
        </div>
    </div>

    {% if tab == "active" %}
        {% if _user_config.show_sidebar == "false" or _is_mobile %}
            {% include note/component/group_special_folder.html %}
        {% end %}

        {% if _is_mobile %}
        <div class="card btn-line-height">
            <span class="tag info">类目</span>
            <span>{{category_info.name}}</span>

            <div class="float-right">
                <div class="dropdown">
                    <span class="dropdown-btn btn btn-default">切换▾</span>
                    <div class="dropdown-mask"></div>
                    <div class="dropdown-content {%if _is_mobile%}mobile{% end %}">
                        {% for t_cat in category_list %}
                            <a class="dropdown-option" href="/note/group?note_category={{t_cat.code}}">
                                <span>{{t_cat.name}}</span>
                                <div class="float-right">
                                    <span class="book-count-span">{{t_cat.group_count}}</span>
                                </div>
                            </a>
                        {% end %}
                    </div>
                </div>
            </div>
        </div>
        {% end %}
    {% end %}

    <!-- 笔记本列表 -->
    {% set files = groups %}
    {% include note/component/note_list_component.html %}

    <!-- 二级笔记本列表 -->
    {% if ext_groups != None %}
        {% set files = ext_groups %}
        {% include note/component/note_list_component.html %}
    {% end %}

    <script>
    $(".switch-category").change(function(e) {
        var selected = $(this).val();
        var url = window.location.href;
        url = xnote.addUrlParam(url, "category", selected);
        window.location.href = url;
    });
    </script>

{% end %}

{% block body_right %}
    {% include note/component/sidebar/group_list_sidebar.html %}
{% end %}

